import { Component, OnInit, EventEmitter } from "@angular/core";
import { KchartSwitcher } from "stock";
import { ChartTypes } from "kchart";
import { Observable } from "rxjs/Observable";
import { StockTopBarService } from "stock";
import { BROADCAST_TYPE, BroadcastService } from "broadcast";

const isSameSwitcher = (newSwitcher: KchartSwitcher, oldSwitcher: KchartSwitcher) => newSwitcher.key === oldSwitcher.key;
const isForbiddenSwitcher = (newSwitcher: KchartSwitcher, oldSwitcher: KchartSwitcher) => newSwitcher.forbid === oldSwitcher.key;
const isSlaveOf = (newSwitcher: KchartSwitcher, oldSwitcher: KchartSwitcher) => newSwitcher.slaveOf === oldSwitcher.key;
const isMasterOf = (newSwitcher: KchartSwitcher, oldSwitcher: KchartSwitcher) => newSwitcher.masterOf === oldSwitcher.key;

@Component({
  // moduleId: module.id,
  selector: "kchart-switcher",
  templateUrl: "kchart-switcher.component.html",
  styleUrls: [
    "kchart-switcher.component.less"
  ],
  inputs: [
    "switcherList",
    "removeSource"
  ],
  outputs: [
    "switcherUpdate"
  ]
})

export class KchartSwitcherComponent implements OnInit {
  zytgList = [];                // 众赢投顾专属指标选中列表
  switcherList: KchartSwitcher[];
  switcherUpdate = new EventEmitter;
  removeSource: Observable<any>;
  constructor(
    private stb: StockTopBarService,
    private broader: BroadcastService
  ) { }

  ngOnInit() {
    if (this.removeSource) {
      this.removeSource.subscribe(toRemove =>
        this.switcherList = this.switcherList.map(switcher =>
          switcher.key === toRemove ?
            Object.assign({}, switcher, { selected: false }) :
            switcher)
      );
    }

    this.broader.broadcast
      .filter(action => action.type === BROADCAST_TYPE.TOGGLE_ZYTG_INDICATOR)
      .subscribe(action => {
        this.zytgList = action.payload.list;
        // 如果含有zygt主图指标则清理掉其他非zytg主图指标
        let lists = this.switcherList.filter(switcher => switcher.selected).filter(switcher => !(switcher.isMain && action.payload.hasMain)).map(switcher => switcher.key);
        lists = [...lists, ...this.zytgList];
        // lists = ["MA", ...this.zytgList];
        this.switcherUpdate.emit(lists);
        // 点击指标时绑定k线图焦点
        let chartSvg = document.querySelectorAll(".k-chart") as NodeListOf<HTMLElement>;
        if (chartSvg[0]) {
          chartSvg[0].click();
        }
      });
    }

    onClick(switcher: KchartSwitcher) {
      // 呵呵，你看这里的selected状态都是反的，猜猜为啥
      this.switcherList =
        this.switcherList.map(oriSwitcher =>
          isSameSwitcher(switcher, oriSwitcher) ?
            Object.assign({}, switcher, { selected: !switcher.selected }) :
            isForbiddenSwitcher(switcher, oriSwitcher) && !switcher.selected ?
              Object.assign({}, oriSwitcher, { selected: false }) :
              isSlaveOf(switcher, oriSwitcher) && !switcher.selected ?
                Object.assign({}, oriSwitcher, { selected: true }) :
                isMasterOf(switcher, oriSwitcher) && switcher.selected ?
                  Object.assign({}, oriSwitcher, { selected: false }) :
                  oriSwitcher);

      let lists = this.switcherList.filter(switcher => switcher.selected).map(switcher => switcher.key);
      lists = [...lists, ...this.zytgList];
      this.switcherUpdate.emit(lists);
      // 点击指标时绑定k线图焦点
      let chartSvg = document.querySelectorAll(".k-chart") as NodeListOf<HTMLElement>;
      if(chartSvg[0]){
        setTimeout(() => {
          chartSvg[0].click();
        }, 200);
      }
      console.debug("Current List: ", lists);
    }
  }